<template>
	<el-dialog
		:title="`编辑${businessModelFn(userInfo.businessModel)}线玩家限红模版`"
		:visible="visible"
		width="520px"
		class="rempadding"
		:destroy-on-close="true"
		:before-close="handleClose"
		@close="handleClose"
	>
		<el-form
			ref="editForm"
			:rules="rules"
			:model="editData"
			label-width="140px"
		>
			<el-form-item :label="`场馆名称:`">{{ curData.name }}</el-form-item>
			<el-form-item :label="`玩家账号:`">
				{{ parentData.userName }}
			</el-form-item>
			<el-form-item :label="`所属总代:`">
				{{ parentData.topProxyName }}
			</el-form-item>
			<el-form-item :label="`已分配的限红模版:`">
				{{ curData.templateName }}
			</el-form-item>
			<el-form-item :label="`可选择限红模版:`">
				<el-radio-group v-model="editData.templateId">
					<el-radio
						class="mb15"
						v-for="item of templateList"
						:key="item.templateId"
						:label="item.templateId"
					>
						{{ item.templateName }}
					</el-radio>
				</el-radio-group>
			</el-form-item>
			<el-form-item :label="`备注(非必填):`">
				<el-input
					v-model="editData.applyRemark"
					placeholder="请输入,最多500个字"
					maxlength="500"
					show-word-limit
					:rows="4"
					clearable
					type="textarea"
					v-input="{ name: 'noEmpty' }"
				></el-input>
			</el-form-item>
		</el-form>
		<div slot="footer" class="dialog-footer">
			<el-button @click="handleClose">
				{{ $t('common.cancel') }}
			</el-button>
			<el-button
				type="primary"
				:disabled="editLoading"
				:loading="editLoading"
				@click="submitEdit"
			>
				{{ $t('common.sure') }}
			</el-button>
		</div>
	</el-dialog>
</template>

<script>
import list from '@/mixins/list'

export default {
	components: {},
	mixins: [list],
	props: {
		curData: {
			type: Object,
			default: {}
		},
		userInfo: { type: Object, default: {} },
		visible: {
			type: Boolean,
			default: false
		},
		parentData: { type: Object, default: () => ({}) },
		handleVisible: {
			type: Object,
			default: () => {}
		}
	},
	computed: {
		rules() {
			return {
				creditLevel: [
					{
						required: true,
						message: this.$t('common.please_choose'),
						trigger: 'blur'
					}
				],
				creditLevelName: [
					{
						required: true,
						message: this.$t('common.please_enter'),
						trigger: 'blur'
					}
				]
			}
		}
	},
	data() {
		return {
			businessModelData: '',
			templateList: [],
			editData: {},
			marketLevelList: [
				{
					name: 'A',
					value: 'A盘'
				},
				{
					name: 'B',
					value: 'B盘'
				},
				{
					name: 'C',
					value: 'C盘'
				}
			],
			editLoading: false,
			tableHeight: 480,
			data: []
		}
	},
	mounted() {
		this.getData()
	},
	methods: {
		businessModelFn(val) {
			const businessModel = {
				'0': '信用现金',
				'1': '现金',
				'2': '信用'
			}
			return businessModel[val]
		},
		// 获取代理账号信息
		getData() {
			this.editLoading = true
			this.$api
				.batchQueryMemberLimitRed({
					memberIds: [this.parentData.userId],
					merchantId: this.parentData.merchantId
				})
				.then((res) => {
					this.editLoading = false
					this.editData = res.data && { ...res.data[0] }
				})
				.catch(() => {
					this.editLoading = false
				})
			this.$api
				.templateList({
					merchantId: this.parentData.merchantId,
					templateId: this.curData.templateId
				})
				.then((res) => {
					this.templateList = res.data
				})
		},
		submitEdit() {
			this.editLoading = true
			this.$api
				.templateUpdateBatch({
					memberIds: [this.parentData.userId],
					...this.editData,
					merchantId: this.parentData.merchantId
				})
				.then((res) => {
					this.$message.success('操作成功')
					this.$emit('update:visible', false)
					this.$emit('handleVisible')
				})
				.catch(() => {
					this.editLoading = false
				})
		},
		handleClose() {
			this.$refs.editForm.resetFields()
			this.$emit('update:visible', false)
		}
	}
}
</script>

<style lang="scss" scoped>
::v-deep .rempadding .el-dialog__header {
	color: #909399;
	font-weight: 700;
}
::v-deep .rempadding .el-dialog__body {
	padding: 0;
	padding-bottom: 30px;
	.contentBox {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.contentBox,
	form {
		padding: 0 20px;
	}
}

::v-deep .el-icon-question:after {
	font-size: 16px;
	margin-left: 0;
}
.td-test {
	margin-bottom: 10px;
	font-size: 14px;
}
.felx-box {
	align-items: center;
	gap: 5px;
}
</style>
